<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<link rel="stylesheet" type="text/css" href="css/CF.css"/>
	</head>
	<script type="text/javascript" src="js/jquery-3.2.1.min.js" ></script>
	<script>
		$(document).ready(function(){
			$("#zuo").hide();
			$("#you").hide();
			$("#tupian").mouseover(function(){     //鼠标移过浮动显示左右浮动箭头
			$("#zuo").addClass("de");
		    $("#yuo").addClass("de");
			$("#zuo").show();
			$("#you").show();
			$("#tupian").mouseout(function(){     //鼠标移出隐藏左右浮动箭头
			$("#zuo").hide();
			$("#you").hide();
			$("#zhi").mousemove(function(){
				$(this).addClass("de");
			})
			$("#zhi").mouseout(function(){
			   $(this).removeClass("de");
			})
			$("#zong").mouseover(function(){
				$(this).css("color","#FFFFFF");
			})
            $("#zong").mouseout(function(){
            	$(this).css("color","#5d97a4");
            })
            $("#gengduo").mouseover(function(){
				$(this).css("color","#FFFFFF");
			})
            $("#gengduo").mouseout(function(){
            	$(this).css("color","#5d97a4");
            })
            $(".lis").mouseover(function(){
            	$(this).css("color","#FFFFFF");
            })
            $(".lis").mouseout(function(){
            	$(this).css("color","#9da2a3");
            })
            $("#gg").mousemove(function(){
            	$(this).css("color","white");
            })
            $("#gg").mouseout(function(){           
            $("#gg").css("color","lightskyblue");
            })
            $("#jingduo").mouseover(function(){
				$(this).css("color","#FFFFFF");
			})
            $("#jingduo").mouseout(function(){
            	$(this).css("color","#5d97a4");
            })
            $("#CFPL").mouseover(function(){
				$("#cfp").css("color","#FFFFFF");
				$("#jingri").css("color","#FFFFFF");
			})
            $("#CFPL").mouseout(function(){
            	$("#cfp").css("color","#5d97a4");
            	$("#jingri").css("color","#5d97a4");
            })
            $(".liss").mouseover(function(){
            	$(this).css("color","#FFFFFF");
            })
            $(".liss").mouseout(function(){
            	$(this).css("color","#9da2a3");
            })
 			})
			})
		})
	</script>
	<body>
		<div id="boder">
			<div id="tupian">					
		   
			<a href="#" ><img src="img/2017-04-26_154127.png" height="240px" width="405px"/ class="nuhai"></a>
			<a href="#" ><img src="img/yyz.jpg"/ height="240px" width="405px" class="mojian"></a>
					
			</div>
			<div id="zbdiv">
				<a href="#" id="zhibo"><input type="button" id="zhi" value="直播专区" /></a>
				<a href="#" ><img src="img/2017-04-26_160122.png" height="170px" id="spjiekou"/></a>
			</div>	
			<div id="zonghe">
				<img id="zixun" src="img/CF咨询.png"/>
                <a href="#"><span id="zong">综合</span></a>
                <a href="#"><span id="gengduo">更多+</span></a>
                <p><hr id="xian" width="450px" color=" #3c4146"/></p>
                <ul id="ul1">
                	<li style="color: red;"><a id="fuli" href=""><span class="lis">约战福利红包精彩来了。快来吧&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;03/16</span></a></li><br /><br />
                	<li style="color: red;"><a id="jingxi" href=""><span class="lis">约战大咖都来啦免房费学技术&nbsp;快来学操作吧;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;03/16</span></a></li><br /><br />
                	<li style="color: red;"><a id="aiyo" href=""><span class="lis">约战辉辉;&nbsp;惊喜走一波&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;03/16</span></a></li><br /><br />
                	<li style="color: red;"><a id="bufu" href=""><span class="lis">不服就干&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;03/16</span></a></li><br /><br />
                </ul>
			</div>
			<div id="gonggao">
				<a href="#"><p id="gg">◀ 公告：关于约战有任何问题欢迎到此反馈</p></a>
			</div>
			<div id="jing">
				<img id="jingping" src="img/CF精品.png"/>
				<a href="#"><span id="jingduo">更多+</span></a>
				<p><hr id="jingxian" width="399px" color=" #3c4146"/></p>
				<a href="#"><div id="CFPL">
					<img id="cpl" src="img/2017-04-26_161159.png" width="150px" height="90px"/>
					<p id="cfp">约战五虎闹东京精彩视频</p>
					<img id="new" src="img/CFnew.png"/>
					<p id="jingri">2017-4-18</p>
				</div>
				
				</a>
				<ul id="ul2">
                	<li style="color: red;"><a id="shenping" href="#"><span class="liss">约战神评论0415期&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;2017-04-16</span></a><br /><br /></li>
                	<li style="color: red;"><a id="jionge" href="#"><span class="liss">【约战河池】来了第一期&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;2017-04-16</span></a><br /><br /></li>
                	<li style="color: red;"><a id="aiyo" href="#"><span class="liss">拳皇最大的Bosss&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;2017-04-16</span></a></li><br /><br />
                </ul>
            
			</div>
			<div id="STG">
				<img src="img/STG活动.png" id="huodong"/>
				<p><hr id="stgxian" width="209px" color=" #3c4146"/></p>
				<a href="#" ><img src="img/$)(NHFE(YWMJGHPAXOQFR64.jpg" height="90px" width="198px" id="qiangwang"/></a>
				<a href="#" ><img src="img/2017-04-26_163910.png" height="70px" width="198px" alt="礼包周周送"/ id="zzs"></a>
			
			</div>
			   
		</div>
		<div >
			<img src="img/约战官方.png" width="859px" id="guanggao" height="200px"/>
		</div>
		<div id="ddd">
			<img src="img/大门.png" id="jl" width="230px" height="120px"/>
		</div>
	</body>
</html>